/**
 * @Description:数据权限展示页面
 * @Author: CHEHSHUANG
 * @Date: 2019/1/24
 */
import React, {Component} from 'react';
import {connect} from "react-redux"
import {Checkbox, Col, Row, Tree} from "antd"
import SimpleTable from "../../../commons/components/SimpleTable";
import {hide, show} from "../../../configs/SharedReducer";
import {findAuthOrganizations, findAuthorizedCorporations} from "./DataAuthorizationService";
import HeadBreadcrumb from "../../../commons/components/breadcrumb/HeadBreadcrumb";
import DetailCard from "../../../commons/components/DetailCard";
import {rowGutter} from "../../../configs/DefaultConfig";

const DirectoryTree = Tree.DirectoryTree;
const {TreeNode} = Tree;

class DataAuthorizationView extends Component {
  initPath = [{name: "数据权限展示"}];
  state = {
    corporations: [],
    organization: [],
  }

  componentDidMount() {
    this.getDataSource();
  }

  getDataSource = () => {
    this.props.show();
    const request = [findAuthOrganizations(), findAuthorizedCorporations()];
    Promise.all(request).then(res => {
      if (res[0]) {
        this.setState({organization: res[0]})
      }
      if (res[1]) {
        this.setState({corporations: res[1]})
      }
    }).catch(e => {
    }).finally(() => {
      this.props.hide();
    })
  }
  getTreeNode = (data) => {
    if (!data) {
      return;
    }
    return data.map(item => {
      if (item.children && item.children.length > 0) {
        return (
          <TreeNode key={item.id} title={item.name}>
            {this.getTreeNode(item.children)}
          </TreeNode>
        )
      }
      return <TreeNode key={item.id} title={item.name} isLeaf={item.nodeLevel !== 0}/>
    });
  }
  getColumns = () => {
    return [
      {
        title: "代码",
        width: 100,
        dataIndex: "code"
      },
      {
        title: "名称",
        width: 200,
        dataIndex: "name"
      },
      {
        title: "ERP公司代码",
        width: 100,
        dataIndex: "erpCode"
      },
      {
        title: "冻结",
        width: 100,
        dataIndex: "frozen",
        align: "center",
        render: (text, record) => {
          return <Checkbox
            disabled
            checked={record.frozen === true}
          />
        }
      },
      {
        title: "排序",
        width: 80,
        dataIndex: "rank",
        render: (text, record, index) => (
          <div style={{textAlign: "right"}}>
            {record.rank}
          </div>
        ),
      }
    ];
  }

  render() {
    const {organization, corporations, scrollY} = this.state;
    return (
      <HeadBreadcrumb
        // pathData={this.initPath}
        className={"allocation-page"}
        style={{overflow: "hidden"}}
      >
        <Row gutter={rowGutter} style={{height: "100%"}}>
          <Col span={8} style={{height: "100%"}}>
            <DetailCard
              style={{height: "100%"}}
              title="组织机构"
              //bodyStyle={{overflow: "auto", height:"100%"}}
            >
              {
                organization ? <DirectoryTree
                  defaultExpandedKeys={organization[0] ? [organization[0].id] : []}
                >
                  {this.getTreeNode(organization)}
                </DirectoryTree> : null
              }
            </DetailCard>
          </Col>
          <Col span={16}>
            <DetailCard className={"child-card"}
                        title="公司"
            >
              <SimpleTable
                data={corporations}
                columns={this.getColumns()}
              />
            </DetailCard>
          </Col>
        </Row>
      </HeadBreadcrumb>
    );
  }
}


const mapStateToProps = (state) => {
  return {};
};
const mapDispatchToProps = {hide, show};
export default connect(mapStateToProps, mapDispatchToProps)(DataAuthorizationView);
